<template>
 <div>
    <div align="center">
        <form name="form1" action="" method="" target="">
          <div style="display:none;">&nbsp;</div>
          <table class="content_report" border="0" cellpadding="0" cellspacing="0">
            <thead>
              <tr>
                <td align="center">
                  <br>
                  <table width="100%" border="0" cellpadding="0" cellspacing="0">
                    <tbody>
                      <tr>
                        <td width="160" class="reportSmallNormal">&nbsp;</td>
                        <td align="center" style="font-family:Arial;font-size:12pt;font-weight:bold;">
                          <div>發票項目報表</div>
                        </td>
                        <td width="200" class="reportSmallNormal" align="right">
                          <div>列印日期: {{ time }}</div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                  <br>
                </td>
              </tr>
              <tr>
                <td align="center">
                  <table border="0" cellpadding="2" cellspacing="0">
                    <tbody>
                      <tr>
                        <td class="reportSmallNormal" align="left" valign="top">加入日期:</td>
                        <td class="reportSmallNormal" align="left" valign="top">
                          {{ obj.time && obj.time.length > 1 ?
                              `${obj.time[0]}至${obj.time[1]}` : `所有`
                          }}
                        </td>
                        <td width="20" class="reportSmallNormal" align="left" valign="top"></td>
                        <td class="reportSmallNormal" align="left" valign="top">員工:</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ obj.admin_name ?obj.admin_name : '所有' }}</td>
                        <td width="20" class="reportSmallNormal" align="left" valign="top"></td>
                        <!-- <td class="reportSmallNormal" align="left" valign="top">課程總數:</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ course_total }}</td> -->
                      </tr>
                    </tbody>
                  </table>
                  <br>
                </td>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td align="center">
                  <table width="1500" border="0" cellpadding="2" cellspacing="0" style="table-layout:fixed;">
                    <colgroup>
                      <col width="100"><!-- 日期 -->
                      <col width="100"><!-- 分校 -->
                      <col width="100"><!-- 發票編號 -->
                      <col width="100"><!-- 學生編號 -->
                      <col width="100"><!-- 學生名稱 -->
                      <col width="100"><!-- 項目分類 -->
                      <col width="200"><!-- (項目編號) 項目名稱 -->
                      <col width="100"><!-- 數量 -->
                      <col width="100"><!-- 項目金額	-->
                      <col width="100"><!-- 已收	 -->
                      <col width="100"><!-- 退款	 -->
                    </colgroup>
                    <thead>
                      <tr>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">日期</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">分校</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">發票編號</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">學生編號</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">學生名稱</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">項目分類</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">(項目編號) 項目名稱</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">數量</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">項目金額</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">已收</td>
                        <td class="reportSmallNormal" align="left" style="border-bottom:1px solid Black;">退款</td>
                      </tr>
                    </thead>
                    <tbody v-for="(item, index) in list" :key="index">
                      <tr>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.create_time }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.school_name }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.number }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.student_number }} </td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.student_name }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ type[item.type]}}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.name }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.num }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.total_prices }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.grandtotal }}</td>
                        <td class="reportSmallNormal" align="left" valign="top">{{ item.refund }}</td>
                      </tr>
                    </tbody>
                <tr>
              </tr>
                  </table>
                </td>
              </tr>
              <tr>
                <td align="center">
                  <br>
                  <span class="reportSmallNormal">*** 報表完 ***</span>
                </td>
              </tr>
              <tr>
                <td align="center">&nbsp;</td>
              </tr>
      
            </tbody>
          </table>
        </form>
      </div>
 </div>
</template>

<script setup>
import {ref,reactive,onMounted, watch, computed} from 'vue'
import {getTime} from '@/common/function.js'
const time = ref('')
const type = {
    1:'產品',
    2:'產品組合',
    3:'課程',
    4:'套票'
}
const props = defineProps({
    list:Object,
    obj:Object,
    total:[String,Number]
})
const tableData = ref([])
watch(()=>props.list,(newval)=>{
tableData.value = newval
})
const totalMoney = computed(()=>tableData.value.reduce((prev, cur) => prev + cur.money*1, 0))

const obj = ref([])
obj.value = props.obj

onMounted(() => {
    time.value = `${getTime().nowDate} ${getTime().nowTime}`
})




</script>

<style scoped lang='less'>
thead {
  display: table-header-group;
}

tfoot {
  display: table-footer-group;
}

.reportSmallBoldNormal {
  font-family: Arial;
  font-size: 8pt;
  font-weight: bold;
}

.reportSmallNormal {
  font-family: Arial;
  font-size: 8pt;
}
</style>